﻿@model DMS.Models.DocumentModel

@{
    ViewBag.Title = "DocumentAdd";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
}

<div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>Thêm mới tài liệu</h2>               
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                @using (Html.BeginForm("DocumentAdd", "Admin", FormMethod.Post, new { id = "form_documentadd", @class = "form-horizontal form-label-left", role = "form" }))
                {
                    @Html.AntiForgeryToken()
                    @Html.ValidationSummary(true)
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Tên tài liệu <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            @Html.TextBoxFor(model => model.DocumentName, new { @class = "form-control col-md-7 col-xs-12" })
                            @Html.ValidationMessageFor(model => model.DocumentName)
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Mã tài liệu <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            @Html.TextBoxFor(model => model.DocumentCode, new { @class = "form-control col-md-7 col-xs-12" })
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Chuyên mục <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            @Html.DropDownListFor(model => model.CategoryId, Model.Category_List, new { @class = "form-control col-md-7 col-xs-12", @onchange = "ChangeDropdown(this,'cat')" })
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Loại tài liệu <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            @Html.DropDownListFor(model => model.DocumentType, Model.DocumentType_List, new { @class = "form-control col-md-7 col-xs-12", @onchange = "ChangeDropdown(this,'doc')" })
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Mô tả
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            @Html.TextAreaFor(model => model.DocumentDescription, new { @class = "form-control col-md-7 col-xs-12", @row = 5 })
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Trạng thái
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">                            
                            <div class="checkbox">
                                <label>
                                    @Html.CheckBoxFor(model => model.Active, new { @class = "flat" })                                    
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">
                            Tải tài liệu
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <div id="dZUpload" class="dropzone" style="width:150px; border:1px solid rgba(0, 0, 0, 0.3); padding:0px">
                            <div class="dz-default dz-message">
                                Kéo thả tài liệu cần upload vào đây
                            </div>
                        </div>
                        </div>
                    </div>
                    @Html.TextBoxFor(model => model.DocumentLink, new { @class = "hidden", id = "DocumentLink" })
                    @Html.TextBoxFor(model => model.DocumentId, new { @class = "hidden" })
                    <div class="ln_solid"></div>
                    <div class="form-group">
                        <div class="col-md-6 col-md-offset-3">                            
                            <button id="send" type="submit" class="btn btn-success">@ViewBag.ButtonName</button>
                            
                        </div>
                    </div>
                }
            </div>
        </div>
    </div>
</div>

<div>
    @Html.ActionLink("Danh sách tài liệu", "Documents","admin")
</div>

@section Scripts {
    <script src="/assets/admin/js/dropzone/dropzone.js"></script>
    <script>

        //Dropzone.options.dropzoneForm = {
        //    maxFiles: 1,
        //    init: function () {
        //        this.on("maxfilesexceeded", function (data) {
        //            var res = eval('(' + data.xhr.responseText + ')');

        //        });
        //        this.on("addedfile", function (file) {

        //            // Create the remove button
        //            var removeButton = Dropzone.createElement("<button>Remove file</button>");


        //            // Capture the Dropzone instance as closure.
        //            var _this = this;

        //            // Listen to the click event
        //            removeButton.addEventListener("click", function (e) {
        //                // Make sure the button click doesn't submit the form:
        //                e.preventDefault();
        //                e.stopPropagation();
        //                // Remove the file preview.
        //                _this.removeFile(file);
        //                // If you want to the delete the file on the server as well,
        //                // you can do the AJAX request here.
        //            });

        //            // Add the button to the file preview element.
        //            file.previewElement.appendChild(removeButton);
        //        });
        //    }
        //};

        $(document).ready(function () {
            UploadFile();
        });
        var catId = $("#CategoryId :selected").val();        
        var docType = $("#DocumentType :selected").val();

        function ChangeDropdown(id, type) {
            if (type == 'cat') {              
                catId = $(id).val();
            }
            else if (type == 'doc') {
                docType = $(id).val();
            }

            console.log(catId, docType);

            UploadFile();
        }

        function UploadFile() {
            Dropzone.autoDiscover = false;
            
            $("#dZUpload").dropzone({
                url: "/uploadfiles.ashx?catId=" + catId + "&docType=" + docType,
                maxFiles: 1,
                addRemoveLinks: true,
                success: function (file, response) {                    
                    file.previewElement.classList.add("dz-success");
                    console.log("Successfully uploaded :", response, response.Status, response.Url, file);
                    if (response.Status == 1) {
                        $("#DocumentLink").val(response.Url);
                    }
                },
                error: function (file, response) {
                    file.previewElement.classList.add("dz-error");
                }
            });
        }
    </script>
}